<template>
  <div class="extractResult">
    <el-dialog title="查看抽取结果" :visible.sync='showExtractResultSync' :before-close="handleCloseDialog">
    <el-card shadow="never">
      <el-table :data="tableData">
        <el-table-column label="专家名" prop="expertName"></el-table-column>
        <el-table-column label="专家分类" prop="categoryName"></el-table-column>
        <el-table-column label="专家职称" prop="expertTitle"></el-table-column>
        <el-table-column label="邀请状态" prop="attendanceFlag">
          <template v-slot="scope">
            <el-tag :type="scope.row.acceptFlag===0?'primary':'success'">{{scope.row.acceptFlag===0?'未接受邀请':'已接受邀请'}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="签到状态" prop="acceptFlag">
          <template v-slot="scope">
            <el-tag :type="scope.row.attendanceFlag===0?'danger':'success'">{{scope.row.attendanceFlag===0?'未签到':'已签到'}}</el-tag>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
      <div class="button">
        <el-button @click="handleCloseDialog">关闭窗口</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { mapState } from 'vuex'
import store from '@/store'
import { GetExtractResultByProjectId } from '@/request/ProjectResult/projectResult-api'

export default {
  computed:{
    listenProjectId(){
      return store.state.ReviewResult.showResultProjectId
    },
    ...mapState({
      showExtractResultSync:state => state.ReviewResult.showExtractResultSync,
      showResultProjectId:state => state.ReviewResult.showResultProjectId
    })
  },
  data(){
    return{
      tableData:[]
    }
  },
  methods:{
    close(){
      this.tableData=[]
      store.commit('ReviewResult/changeShowResultProjectId',null)
      store.commit('ReviewResult/changeShowExtractResultSync',false)
    },
    async initData (projectId) {
      let res = await GetExtractResultByProjectId(projectId)
      if(res&&res.code===200){
        this.tableData=res.data
      }else {
        this.$message.error("获取抽取结果失败")
      }
    },
    handleCloseDialog () {
      this.$confirm('确定取消查看抽取结果信息吗？', '提示', {
        'confirmButtonText': '确定',
        'cancelButtonText': '取消',
        'type': 'info'
      }).then(() => {
        this.close()
      }).catch((e) => {
        if (e === 'cancel') {
          if (e === 'cancel') {
          }
        }
      })
    }
  },watch:{
    listenProjectId:{
      immediate:true,
      handler(val,old){
        if (val){
          this.initData(val)
        }
      }
    }
  }
}
</script>
<style scoped lang="less">
.button{
  margin: 10px;
  text-align: center;
}
</style>
